<template>
  <div>
    <div>
      <button @click="componentsName='One'">One</button>
      <button @click="componentsName='Two'">two</button>
      <button @click="componentsName='Three'">three</button>
    </div>

    <keep-alive :include="['One','Two']">
      <component :is='componentsName'></component>
     </keep-alive>
  </div>
</template>
<script>
import One from '@/components/One'
import Two from '@/components/Two'
import Three from '@/components/Three'
export default {
  name:"App",
  components:{
    One,
    Two,
    Three,
  },
  data(){
    return {
      componentsName:"One",
    }
  }
};
</script>